<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Generator函数简介</title>
</head>
<body>
    <h1>Generator函数简介</h1>
    <h2>Generator函数是ES6提供的一种异步编程解决方案</h2>

    <script>
        // 基本语法
        function* helloWorldGenerator() {
            yield 'hello';
            yield 'world';
            return 'ending';
        }

        const hw = helloWorldGenerator();
        console.log(hw.next()); // { value: 'hello', done: false }
        console.log(hw.next()); // { value: 'world', done: false }
        console.log(hw.next()); // { value: 'ending', done: true }
        console.log(hw.next()); // { value: undefined, done: true }

        // Generator函数与普通函数的区别
        function* gen() {
            console.log('执行开始');
            yield 'step 1';
            console.log('执行中间步骤');
            yield 'step 2';
            console.log('执行结束');
            return 'done';
        }

        const g = gen();
        console.log('准备开始执行');
        console.log(g.next());
        console.log('第一步完成');
        console.log(g.next());
        console.log('第二步完成');
        console.log(g.next());

        // yield表达式只能用在Generator函数中
        function* f() {
            yield 'hello';
            // 在另一个函数里面使用yield会报错
            // function inner() {
            //     yield 'world'; // SyntaxError
            // }
        }
    </script>
</body>
</html> 